<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/include/adminHead.jsp"%>
<script type="text/javascript">
var _this = this;
var markerSetting = {
		paging:{}
}
$(function() {

	init();
	});
	
function init() {

  	_this.userList = tableSync('userList');
		markerSetting.paging.page = 1;
		markerSetting.paging.totalPage ='<c:out value="${totalPage}"/>';
		markerSetting.paging.nowSeq = 1;
		
		getUserList();
}

function getUserList() {
	  	var url='/admin/userList.json';
	
		var param=markerSetting.paging;
		
		AjaxPost(url, param, function(data){
//	 		jsonLog(data.userList);
// 			$.each(data.userList,function(index, value){
// 				value.regiTime = formatter.dateFormatYYYYMMDDHHMMSS2(new Date(value.regiTime));
// 			});
			_this.userList.tableAutoSync(data.userList);
			markerSetting.paging.totalPage= data.totalPage;
			makePaging();
		});
}

function getSearchBoardList() {
	  markerSetting.paging.searchType = $("select[name=searchType]").val();
	  markerSetting.paging.searchName = $("#searchName").val();
	  
	  getUserList();
}
function makePaging() {
	$('#pagenation').html("");
		var totalPage = markerSetting.paging.totalPage;
		var nowPage = markerSetting.paging.page;
		var html='';
		var setFunctionName='';
		var index=(nowPage-10);
		var indexCount=0;
		
		var endPage = totalPage / 10;
		if (totalPage % 10 > 0) {
			endPage = endPage + 1;
		}
		if(index>1){
			html+='<a onclick="changePaging(1,\'before\''+')" onFocus=this.blur()><img src="${imgUrl }/btn_first.jpg"/ alt=처음 align=absmiddle style="/cursor:hand;/"></a>';
			html+='<a onclick="changePaging('+index+',\'before\''+')" onFocus=this.blur()><img src="${imgUrl }/btn_prev.jpg"/  alt=이전 align=absmiddle style="/cursor:hand;/"></a>&nbsp;&nbsp;';
		}
//		//logs('totalPage/20 = '+totalPage/20);
		for(;index<=endPage;index++){
			if((index)==nowPage){
				setFunctionName='';
			}else{
				setFunctionName=' onclick="changePaging('+index+')"';
			}
			
			if(index>0){
					
				if(index == nowPage) {
					html+='<a '+setFunctionName+'><b>'+index+'</b></a>&nbsp;';
				} else {
					html+='<a '+setFunctionName+' style=cursor:hand;>'+index+'</a>&nbsp;';
				}	
				
				indexCount++;
			}
			if(indexCount>9){
				html+='<a onclick="changePaging('+index+',\'after\''+')" onFocus=this.blur()><img src="${imgUrl }/btn_next.jpg"/  alt=다음 align=absmiddle style="/cursor:hand;/"></a>';
				html+='<a onclick="changePaging('+totalPage+',\'after\''+')" onFocus=this.blur()><img src="${imgUrl }/btn_last.jpg"/  alt=맨끝 align=absmiddle style="/cursor:hand;/"></a>';
				break;
			}
			
		}
		$('#pagenation').html(html);
}

function changePaging(index, option){
		logs('markerSetting.paging.totalPage = '+markerSetting.paging.totalPage);
		if(option==null){
			logs(', index = '+index);
			
			markerSetting.paging.page=index;
			markerSetting.paging.start=0;
			markerSetting.paging.end=0;
			getUserList();
		}else{
			if(option=='before'){
				var next = index-9;
				while(next<=0){
					next++;
				}
				logs('next = '+next+', index = '+index);
				markerSetting.paging.page=next;
				markerSetting.paging.start=0;
				markerSetting.paging.end=0;
				getUserList();
			}else if(option=='after'){
				var next = index+9;
				while(next>=(markerSetting.paging.totalPage/10)+1){
					next--;
				}
				logs('next = '+next+', index = '+index);
				markerSetting.paging.page=next;
				markerSetting.paging.start=0;
				markerSetting.paging.end=0;
				getUserList();
			}
		}
	}

var searchMember = function(){
	var searchValue = $('#search_word').val(); 
	if(searchValue){
		markerSetting.paging[$('#search_type').val()]=searchValue;
		getUserList();
		markerSetting.paging[$('#search_type').val()]=undefined;
	}
};
function hitEnterKey(e){
	  if(e.keyCode == 13){
		  searchMember();
		  return false;
	  }
} 
</script>
<TR>
	<TD height="%" valign="top">
		<TABLE width="100%" height="100%" border="0" cellspacing="0"
			cellpadding="0">
			<TBODY>
				<TR>
					<TD width="186" height="%" align="right" valign="top">
						<!-- Left Menu table 시작 -------------------------------->

						<TABLE width="176" height="100%" border="0" cellspacing="0"
							cellpadding="0">
							<TBODY>
								<TR>
									<TD height="53"><IMG src="${imgUrl}/left_top_title.gif"></TD>
								</TR>
								<TR>
									<TD height="%" background="${imgUrl}/left_bg.gif" valign="top"
										style="padding: 5px 0px 0px 5px;"><LINK
											href="${imgUrl}/admin.css" rel="stylesheet" type="text/css">
										<!-- Menu table 끝 * css사용 해당메뉴의 페이지일때는  class="leftmenu_b", 해당 메뉴페이지가 아닐경우  class="leftmenu"로 사용-------------------------------->
										<TABLE width="150" style="margin-top: 10px;" border="0"
											cellspacing="0" cellpadding="0">
											<TBODY>
												<tr>
													<td height="25"><img src="${imgUrl}/left_icon.gif"
														border="0" align="absmiddle" /><a class="leftmenu"
														href="#">회원관리</a></td>
												</tr>
											</TBODY>
										</TABLE></TD>
								</TR>
							</TBODY>
						</TABLE>
						<!-- Left Menu table 끝 -------------------------------->
					</TD>
					<TD width="%" align="right" valign="top"
						style="padding: 20px 10px 0px 0px;">
						<TABLE width="97%" border="0" cellspacing="0" cellpadding="0">
							<TBODY>
								<TR>
									<TD align="left" class="admin_title"
										background="${imgUrl}/title_bg.gif" valign="middle"><IMG
										align="absmiddle" src="${imgUrl}/title_icon.gif">회원관리</TD>
								</TR>
								<TR>
									<TD height="20">&nbsp;</TD>
								</TR>
								<TR>
									<TD>
										<TABLE width="100%" border="0" cellspacing="0" cellpadding="0">
											<TBODY>
												<TR>
													<TD>
														<TABLE width="100%" bgcolor="#d9d9d9" border="0" cellspacing="1" cellpadding="0">
															<TBODY>
																<TR>
																	<TD height="1" bgcolor="#3f8bc9" colspan="4"></TD>
																</TR>
																<TR>
																	<TD width="25%" align="center" class="top_blue3"
																		bgcolor="#eff3fa">번호</TD>
																	<TD width="25%" align="center" class="top_blue3"
																		bgcolor="#eff3fa">아이디</TD>
																	<TD width="25%" align="center" class="top_blue3"
																		bgcolor="#eff3fa">이름</TD>
																	<TD width="25%" align="center" class="top_blue3"
																		bgcolor="#eff3fa">이메일</TD>
																</TR>
																</tbody>
																</table>
														<TABLE id="userList" width="100%" bgcolor="#d9d9d9" border="0" cellspacing="1" cellpadding="0">
															<TBODY>		
																<tr>
																	<TD width="25%"  align="center" class="list_dark" bgcolor="#ffffff" id="seq"></TD>
																	<TD width="25%"  align="center" class="list_dark" bgcolor="#ffffff"><a href="#" onclick="gotoMember_view(this)" id="userId"></a></TD>
																	<TD width="25%"  align="center" class="list_dark" bgcolor="#ffffff" id="userName"></TD>
																	<TD width="25%"  align="center" class="list_dark" bgcolor="#ffffff" id="email"></TD>
																</tr>
															</TBODY>
														</TABLE>
<!-- 														</FORM> -->
														<!--리스트 테이블 끝-->
													</TD>
												</TR>
												<!-- <TR>
                      <TD height="30" align="right" valign="bottom" 
                        colspan="7"><A href="/webadmin/announce_write.php"><IMG 
                        src="${imgUrl}/btn_write.gif"></A></TD></TR> -->
												<TR>
													<TD height="35" align="center" valign="middle" colspan="7">
														 <div id="pagenation"></div>
													</TD>
												</TR>
												<TR>
													<TD align="center" colspan="7">
														<FORM name="fsearch" style="margin: 0px;" method="post" onkeydown="hitEnterKey(event)" onsubmit="return false;">
															<TABLE border="0" cellspacing="0" cellpadding="0">
																<TBODY>
																	<TR>
																		<TD align="middle" valign="middle"
																			style="padding: 3px 0px 0px 5px;"><SELECT
																			name="search_type" class="inputText" id="search_type"><OPTION
																					 selected value="userName">이름</OPTION>
																				<OPTION value="userId">아이디</OPTION>
																		</SELECT> <INPUT name="search_word" id="search_word" class="inputText"
																			type="text" size="30" maxlength="25" onKeypress="" /></TD>
																		<TD align="right" valign="middle"
																			style="padding-left: 5px;"><img
																			align="absmiddle" style="cursor: hand;" 
																			src="${imgUrl}/n_search.gif" hspace="3" onclick="searchMember()" /></TD>
																	</TR>
																</TBODY>
														</TABLE>
													</FORM>
													</TD>
												</TR>
												<TR>
													<TD>&nbsp;</TD>
												</TR>
											</TBODY>
										</TABLE>
									</TD>
								</TR>
							</TBODY>
						</TABLE>
					</TD>
				</TR>
			</TBODY>
		</TABLE>
	</TD>
</TR>
</TBODY>
</TABLE>
<script type="text/javascript">
var gotoMember_view = function(text){
	location.replace("/admin/memberView?userId="+$(text).text());    
};
</script>
</BODY>
</HTML>
